// Tests / Mixins / Heading

// th-heading()
// ------------------------------

mixin th-heading {

  @include th-assert(
    $describe: "Output styles for a heading."
  ){
    @include th-assert-expect {
      font-size: 0.55556em;
      line-height: 2;
      margin-top: 30px;
      margin-bottom: 1.66667rem;
    }
    @include th-assert-actual {
      @include th-heading(h1);
    }
  }

  @include th-assert(
    $describe: "Output styles for a heading manually."
  ){
    @include th-assert-expect {
      font-size: 0.55556em;
      line-height: 2;
      margin-top: 30px;
      margin-bottom: 1.66667rem;
    }
    @include th-assert-actual {
      @include th-heading(10px 20px (30px 40px));
    }
  }

  @include th-assert(
    $describe: "Output styles for a heading with a breakpoint."
  ){
    @include th-assert-expect {
      font-size: 2.77778em;
      line-height: 1.2;
      margin-top: 70px;
      margin-bottom: 3.33333rem;
    }
    @include th-assert-actual {
      @include th-heading(h1, 768px);
    }
  }

  @include th-assert(
    $describe: "Output styles for a heading with a breakpoint manually."
  ){
    @include th-assert-expect {
      font-size: 2.77778em;
      line-height: 1.2;
      margin-top: 70px;
      margin-bottom: 3.33333rem;
    }
    @include th-assert-actual {
      @include th-heading((10px 20px (30px 40px), 50px 60px (70px 80px) 768px, 90px 100px (110px 120px) 1024px), 768px);
    }
  }

  @include th-assert(
    $describe: "Output styles for a heading with a default keyword."
  ){
    @include th-assert-expect {
      font-size: 0.22222em;
      line-height: 0.5;
      margin-top: 28px;
      margin-bottom: 2rem;
    }
    @include th-assert-actual {
      @include th-heading(h7);
    }
  }

  @include th-assert(
    $describe: "Output styles for a heading with only one value."
  ){
    @include th-assert-expect {
      font-size: 0.27778em;
      line-height: 0.4;
      margin-top: 3px;
      margin-bottom: 0.16667rem;
    }
    @include th-assert-actual {
      @include th-heading(h6);
    }
  }

  @include th-assert(
    $describe: "Output styles for a heading with a singular list value."
  ){
    @include th-assert-expect {
      font-size: 0.5em;
      line-height: 2.11111;
      margin-top: 29px;
      margin-bottom: 1.20833rem;
    }
    @include th-assert-actual {
      @include th-heading(h2);
    }
  }

  @include th-assert(
    $describe: "Output only font-size and line-height styles for a heading."
  ){
    @include th-assert-expect {
      font-size: 0.55556em;
      line-height: 2;
    }
    @include th-assert-actual {
      @include th-heading(
        $heading: h1,
        $include: (font-size line-height)
      );
    }
  }

}

// th-headings()
// ------------------------------

mixin th-headings {

  @include th-assert(
    $describe: "Output styles for a heading."
  ){
    @include th-assert-expect {
      font-size: 0.27778em;
      line-height: 0.4;
      margin-top: 3px;
      margin-bottom: 0.16667rem;
    }
    @include th-assert-actual {
      @include th-headings(h6);
    }
  }

  @include th-assert(
    $describe: "Output styles for a heading with multiple breakpoints."
  ){
    @include th-assert-expect {
      font-size: 0.55556em;
      line-height: 2;
      margin-top: 30px;
      margin-bottom: 1.66667rem;
      @media (min-width: 768px) {
        font-size: 2.77778em;
        line-height: 1.2;
        margin-top: 70px;
        margin-bottom: 3.33333rem;
      }
      @media (min-width: 1024px) {
        font-size: 5em;
        line-height: 1.11111;
        margin-top: 110px;
        margin-bottom: 5rem;
      }
    }
    @include th-assert-actual {
      @include th-headings(h1);
    }
  }

  @include th-assert(
    $describe: "Output font-size and line-height styles for h1 heading with multiple breakpoints."
  ){
    @include th-assert-expect {
      font-size: 0.55556em;
      line-height: 2;
      @media (min-width: 768px) {
        font-size: 2.77778em;
        line-height: 1.2;
      }
      @media (min-width: 1024px) {
        font-size: 5em;
        line-height: 1.11111;
      }
    }
    @include th-assert-actual {
      @include th-headings(
        $heading: h1,
        $include: (font-size line-height)
      );
    }
  }

  @include th-assert(
    $describe: "Output styles for a heading with no breakpoint."
  ){
    @include th-assert-expect {
      font-size: 0.16667em;
      line-height: 1.33333;
      margin-top: 5px;
      margin-bottom: 0.20833rem;
    }
    @include th-assert-actual {
      @include th-headings(h8);
    }
  }

}

// _th-heading-context-loop()
// ------------------------------

mixin _th-heading-context-loop {

  @include th-assert(
    $describe: "Simple loop through a heading."
  ){
    @include th-assert-expect {
      result: null;
      result: null;
      result: null;
    }
    @include th-assert-actual {
      @include _th-heading-context-loop(h1) {
        result: null;
      }
    }
  }

  @include th-assert(
    $describe: "Return heading font size from each list in a heading."
  ){
    @include th-assert-expect {
      result: 10px 20px (30px 40px);
      result: 50px 60px (70px 80px) 768px;
      result: 90px 100px (110px 120px) 1024px;
    }
    @include th-assert-actual {
      $loop: 1;
      $heading: th-heading-get-map(h1);
      @include _th-heading-context-loop($heading) {
        result: nth($heading, $loop);
        $loop: $loop + 1;
      }
    }
  }

}

// th-heading-context()
// ------------------------------

mixin th-heading-context {

  @include th-assert(
    $describe: "Loop heading context without breakpoint output."
  ){
    @include th-assert-expect {
      result: 10px 20px (30px 40px);
      result: 50px 60px (70px 80px) 768px;
      result: 90px 100px (110px 120px) 1024px;
    }
    @include th-assert-actual {
      @include th-heading-context(h1) {
        result: th-core-context-get(heading);
      }
    }
  }

  @include th-assert(
    $describe: "Loop heading context with breakpoint output."
  ){
    @include th-assert-expect {
      result: 10px 20px (30px 40px);
      @media (min-width: 768px) {
        result: 50px 60px (70px 80px) 768px;
      }
      @media (min-width: 1024px) {
        result: 90px 100px (110px 120px) 1024px;
      }
    }
    @include th-assert-actual {
      @include th-heading-context(h1, true) {
        result: th-core-context-get(heading);
      }
    }
  }

}

// th-h()
// ------------------------------

mixin th-h {

  @include th-assert(
    $describe: "Output styles for a heading."
  ){
    @include th-assert-expect {
      font-size: 0.55556em;
      line-height: 2;
      margin-top: 30px;
      margin-bottom: 1.66667rem;
    }
    @include th-assert-actual {
      @include th-h(h1);
    }
  }

  @include th-assert(
    $describe: "Output styles for a heading manually."
  ){
    @include th-assert-expect {
      font-size: 0.55556em;
      line-height: 2;
      margin-top: 30px;
      margin-bottom: 1.66667rem;
    }
    @include th-assert-actual {
      @include th-h(10px 20px (30px 40px));
    }
  }

  @include th-assert(
    $describe: "Output styles for a heading with a breakpoint."
  ){
    @include th-assert-expect {
      font-size: 2.77778em;
      line-height: 1.2;
      margin-top: 70px;
      margin-bottom: 3.33333rem;
    }
    @include th-assert-actual {
      @include th-h(h1, 768px);
    }
  }

  @include th-assert(
    $describe: "Output styles for a heading with a breakpoint manually."
  ){
    @include th-assert-expect {
      font-size: 2.77778em;
      line-height: 1.2;
      margin-top: 70px;
      margin-bottom: 3.33333rem;
    }
    @include th-assert-actual {
      @include th-h((10px 20px (30px 40px), 50px 60px (70px 80px) 768px, 90px 100px (110px 120px) 1024px), 768px);
    }
  }

  @include th-assert(
    $describe: "Output styles for a heading with a default keyword."
  ){
    @include th-assert-expect {
      font-size: 0.22222em;
      line-height: 0.5;
      margin-top: 28px;
      margin-bottom: 2rem;
    }
    @include th-assert-actual {
      @include th-h(h7);
    }
  }

  @include th-assert(
    $describe: "Output styles for a heading with only one value."
  ){
    @include th-assert-expect {
      font-size: 0.27778em;
      line-height: 0.4;
      margin-top: 3px;
      margin-bottom: 0.16667rem;
    }
    @include th-assert-actual {
      @include th-h(h6);
    }
  }

  @include th-assert(
    $describe: "Output styles for a heading with a singular list value."
  ){
    @include th-assert-expect {
      font-size: 0.5em;
      line-height: 2.11111;
      margin-top: 29px;
      margin-bottom: 1.20833rem;
    }
    @include th-assert-actual {
      @include th-h(h2);
    }
  }

  @include th-assert(
    $describe: "Output only font-size and line-height styles for a heading."
  ){
    @include th-assert-expect {
      font-size: 0.55556em;
      line-height: 2;
    }
    @include th-assert-actual {
      @include th-h(
      $heading: h1,
      $include: (font-size line-height)
      );
    }
  }

}

// th-hs()
// ------------------------------

mixin th-hs {

  @include th-assert(
    $describe: "Output styles for a heading."
  ){
    @include th-assert-expect {
      font-size: 0.27778em;
      line-height: 0.4;
      margin-top: 3px;
      margin-bottom: 0.16667rem;
    }
    @include th-assert-actual {
      @include th-hs(h6);
    }
  }

  @include th-assert(
    $describe: "Output styles for a heading with multiple breakpoints."
  ){
    @include th-assert-expect {
      font-size: 0.55556em;
      line-height: 2;
      margin-top: 30px;
      margin-bottom: 1.66667rem;
      @media (min-width: 768px) {
        font-size: 2.77778em;
        line-height: 1.2;
        margin-top: 70px;
        margin-bottom: 3.33333rem;
      }
      @media (min-width: 1024px) {
        font-size: 5em;
        line-height: 1.11111;
        margin-top: 110px;
        margin-bottom: 5rem;
      }
    }
    @include th-assert-actual {
      @include th-hs(h1);
    }
  }

  @include th-assert(
    $describe: "Output font-size and line-height styles for h1 heading with multiple breakpoints."
  ){
    @include th-assert-expect {
      font-size: 0.55556em;
      line-height: 2;
      @media (min-width: 768px) {
        font-size: 2.77778em;
        line-height: 1.2;
      }
      @media (min-width: 1024px) {
        font-size: 5em;
        line-height: 1.11111;
      }
    }
    @include th-assert-actual {
      @include th-hs(
      $heading: h1,
      $include: (font-size line-height)
      );
    }
  }

}